<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Option</title>
    <link rel="stylesheet" href="css/option.css">
    <script src="libs/jquery-3.1.1.min.js" type="text/javascript"></script>
</head>
<body>
<div class="wrapper">
    <div class="option-header">
        <h1>Option for Weather</h1>
    </div>
    <div class="option-body">
        <fieldset id="appid">
            <legend>APP ID</legend>
            <label>
                <span>openweathermap.org:</span><br>
                <input type="text" size="40" name="appid" style="text-align: center"/> <a href="https://home.openweathermap.org/api_keys">点击获取</a>
            </label> <br>
            <label>
                <span>aqicn.org:</span><br>
                <input type="text" size="40" name="aqicnToken" style="text-align: center"/> <a href="http://aqicn.org/data-platform/token/#/">点击获取</a>
            </label>
        </fieldset>
        <p class="notify">
            关于 <a href="https://github.com/hocgin/WeatherForChrome#qa">为什么需要申请 APP ID?</a>
        </p>
        <fieldset id="location">
            <legend data-see="http://bjtime.cn/info/getjw.asp?s=fj">定位</legend>
            <label>
                <span>纬度:</span>
                <input type="text" name="latitude" value="">
            </label> <br>
            <label>
                <span>经度:</span>
                <input type="text" name="longitude" value="">
            </label> <br>
            <input type="button" name="Get" value="自动获取">
        </fieldset>
        <p class="notify">
            作者: <a href="http://hocg.in">hocgin</a> /
            <a href="https://www.github.com/hocgin" target="_blank">GitHub</a> /
            <a href="http://www.weibo.com/hocgin" target="_blank">WeiBo</a>.
        </p>
        <fieldset id="refresh">
            <legend>刷新间隔</legend>
            <label>
                <input type="text" name="refresh-time"> (单位: ms).
            </label>
            <div>最后一次更新: <span class="last-time">2017/10/8 下午10:36:27</span></div>
            <input type="button" name="Refresh" value="手动刷新">
        </fieldset>

        <fieldset id="badge">
            <legend>徽章显示</legend>
            <label>
                <input type="radio" name="badge" value="none"> 不显示&nbsp;
            </label>
            <label>
                <input type="radio" name="badge" value="temp"> 温度&nbsp;
            </label>
            <label>
                <input type="radio" name="badge" value="description"> 天气描述&nbsp;
            </label>
            <label>
                <input type="radio" name="badge" value="airQuality"> 空气质量&nbsp;
            </label>
            <label>
                <input type="radio" name="badge" value="aqi"> AQI 指数&nbsp;
            </label>
        </fieldset>

        <fieldset id="style">
            <legend>天气样式</legend>
            <label>
                <input type="radio" name="style" value="style1"> 静态风格&nbsp;
            </label>
            <label>
                <input type="radio" name="style" value="style2"> 动态风格(Beta)&nbsp;
            </label>
        </fieldset>

        <fieldset id="dashboard">
            <legend>仪表盘</legend>
            <legend>左侧</legend>
            <label>
                <input type="radio" name="dashboardLeft" value="wind"> 风速+风向&nbsp;
            </label>
            <label>
                <input type="radio" name="dashboardLeft" value="humidity"> 湿度&nbsp;
            </label>
            <label>
                <input type="radio" name="dashboardLeft" value="pm25"> PM2.5&nbsp;
            </label>
            <label>
                <input type="radio" name="dashboardLeft" value="pm10"> PM10&nbsp;
            </label>
            <label>
                <input type="radio" name="dashboardLeft" value="barometer"> 气压&nbsp;
            </label>
            <label>
                <input type="radio" name="dashboardLeft" value="cloudsAll"> 云量&nbsp;
            </label>
            <label>
                <input type="radio" name="dashboardLeft" value="visibility"> 能见度&nbsp;
            </label>
            <br>
            <legend>右侧</legend>
            <label>
                <input type="radio" name="dashboardRight" value="wind"> 风速+风向&nbsp;
            </label>
            <label>
                <input type="radio" name="dashboardRight" value="humidity"> 湿度&nbsp;
            </label>
            <label>
                <input type="radio" name="dashboardRight" value="pm25"> PM2.5&nbsp;
            </label>
            <label>
                <input type="radio" name="dashboardRight" value="pm10"> PM10&nbsp;
            </label>
            <label>
                <input type="radio" name="dashboardRight" value="barometer"> 气压&nbsp;
            </label>
            <label>
                <input type="radio" name="dashboardRight" value="cloudsAll"> 云量&nbsp;
            </label>
            <label>
                <input type="radio" name="dashboardRight" value="visibility"> 能见度&nbsp;
            </label>
        </fieldset>

        <!--Unit Default: Kelvin, Metric: Celsius, Imperial: Fahrenheit.-->
        <fieldset id="tempUnit">
            <legend>温度单位</legend>
            <label>
                <input type="radio" name="tempUnit" value="default"> 开氏度&nbsp;
            </label>
            <label>
                <input type="radio" name="tempUnit" value="metric"> 摄氏度&nbsp;
            </label>
            <label>
                <input type="radio" name="tempUnit" value="imperial"> 华氏度&nbsp;
            </label>
        </fieldset>

        <fieldset id="language">
            <legend>语言</legend>
            <label>
                <select class="language">
                </select>
            </label>
        </fieldset>
    </div>
    <div class="option-footer">
        <input type="button" name="Reset" value="重置">
        <input type="button" name="Save" value="保存">
        <input type="button" name="Close" value="关闭">
    </div>
</div>
<script src="js/option.js" type="text/javascript"></script>
</body>
</html>